<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Floors list</title>
    </h:head>
    <h:body>
	<ui:composition template="templates/template.xhtml">

	    <ui:define name="content">

		<p:layoutUnit position="center" resizable="true" closable="true" collapsible="true">

		    <p:dataTable value="#{floors.floorsList}" var="floor" 
				 selection="#{floors.selectedFloor}" selectionMode="single" id="table">  

			<p:ajax event="rowSelect" update=":table" oncomplete="deleteDialog.show()" />  
			<p:ajax event="rowUnselect" update=":table"/>  

			<f:facet name="header">  
			    List of Floors
			</f:facet>  

			<p:column headerText="Number">  
			    <h:outputText value="#{floor.number}" />  
			</p:column>  

			<p:column headerText="XSize">  
			    <h:outputText value="#{floor.XSize}" />
			</p:column>  

			<p:column headerText="YSize">  
			    <h:outputText value="#{floor.YSize}" />  
			</p:column>  

			<p:column headerText="Height">  
			    <h:outputText value="#{floor.height}" />  
			</p:column>

			<p:column style="width:4%">  
			    <p:commandButton id="editButton" update=":table" oncomplete="carDialog.show()" icon="ui-icon-search" title="View">  
				<f:setPropertyActionListener value="#{car}" target="#{tableBean.selectedCar}" />  
			    </p:commandButton>  
			</p:column>  
		    </p:dataTable>

		    <p:dialog header="Car Detail" widgetVar="carDialog" resizable="false" id="carDlg"  
			      showEffect="fade" hideEffect="explode" modal="true">  

			<h:panelGrid id="display" columns="2" cellpadding="4" style="margin:0 auto;">  

			    <f:facet name="header">  
				<p:graphicImage value="/images/cars/#{tableBean.selectedCar.manufacturer}.jpg"/>  
			    </f:facet>  

			    <h:outputText value="Model:" />  
			    <h:outputText value="#{tableBean.selectedCar.model}" style="font-weight:bold"/>  

			    <h:outputText value="Year:" />  
			    <h:outputText value="#{tableBean.selectedCar.year}" style="font-weight:bold"/>  


			    <h:outputText value="Manufacturer:" />  
			    <h:outputText value="#{tableBean.selectedCar.manufacturer}" style="font-weight:bold"/>  

			    <h:outputText value="Color:" />  
			    <h:outputText value="#{tableBean.selectedCar.color}" style="font-weight:bold"/>  

			</h:panelGrid>  

		    </p:dialog>  
		</p:layoutUnit>
	    </ui:define>

	</ui:composition>
    </h:body>
</html>

